﻿<PPageHeader Title="Order"
             Subtitle="This is an order page!"
             OnBack="OnBack"
             OnSearch="OnSearch"
             ShowFiltersByDefault>
    <LeftActions>
        <MButton Color="primary"><MIcon Left>mdi-plus</MIcon>Add Order</MButton>
    </LeftActions>

    <RightActions>
        <MButton Icon OnClick="OnClear">
            <MIcon>mdi-refresh</MIcon>
        </MButton>
    </RightActions>

    <Filters Context="filter">
        <MRow Dense>
            <MCol Cols="6">
                <MTextField @bind-Value="orderId"
                            Label="Order ID"
                            Outlined
                            Dense
                            TValue="string"
                            HideDetails="true"
                            OnKeyDown="@filter.onEnter">
                </MTextField>
            </MCol>
            <MCol Cols="6">
                <MSelect @bind-Value="user"
                         Outlined
                         Dense
                         Label="User"
                         Items="users"
                         ItemValue="i => i"
                         ItemText="i => i"
                         HideDetails="true"
                         TItem="string"
                         TValue="string"
                         TItemValue="string"
                         OnSelectedItemUpdate="_ => filter.onSearch()">
                </MSelect>
            </MCol>
            <MCol Cols="6">
                <MMenu @bind-Value="visible1"
                       CloseOnContentClick="false"
                       OffsetY
                       MinWidth="290">
                    <ActivatorContent>
                        <MTextField @bind-Value="start"
                                    Label="Start date"
                                    Outlined
                                    Dense
                                    Readonly
                                    HideDetails="true"
                                    @attributes="@context.Attrs">
                        </MTextField>
                    </ActivatorContent>
                    <ChildContent>
                        <MDatePicker @bind-Value="date1"
                                     NoTitle
                                     Scrollable>
                            <MSpacer></MSpacer>
                            <MButton Text
                                     Color="primary"
                                     OnClick="() => visible1 = false">
                                Cancel
                            </MButton>
                            <MButton Text
                                     Color="primary"
                                     OnClick="() => StartDateClick(filter.onSearch)">
                                OK
                            </MButton>
                        </MDatePicker>
                    </ChildContent>
                </MMenu>
            </MCol>
            <MCol Cols="6">
                <MMenu @bind-Value="visible2"
                       CloseOnContentClick="false"
                       OffsetY
                       MinWidth="290">
                    <ActivatorContent>
                        <MTextField @bind-Value="end"
                                    Label="End date"
                                    Readonly
                                    Outlined
                                    Dense
                                    HideDetails="true"
                                    @attributes="@context.Attrs">
                        </MTextField>
                    </ActivatorContent>
                    <ChildContent>
                        <MDatePicker @bind-Value="date2"
                                     NoTitle
                                     Scrollable>
                            <MSpacer></MSpacer>
                            <MButton Text
                                     Color="primary"
                                     OnClick="() => visible2 = false">
                                Cancel
                            </MButton>
                            <MButton Text
                                     Color="primary"
                                     OnClick="() => EndDateClick(filter.onSearch)">
                                OK
                            </MButton>
                        </MDatePicker>
                    </ChildContent>
                </MMenu>
            </MCol>
        </MRow>
    </Filters>
</PPageHeader>

@code {
    readonly List<string> users = new() { "Rachel Greene", "Monica Geller", "Joey Tribbiani", "Ross Geller", "Chandler Bing", "Phoebe Buffay" };

    DateOnly date1 = DateOnly.FromDateTime(DateTime.Now);
    DateOnly date2 = DateOnly.FromDateTime(DateTime.Now);

    bool visible1;
    bool visible2;

    string orderId;
    string user;
    string start;
    string end;
    
    async Task StartDateClick(Func<Task> onSearch)
    {
        start = date1.ToShortDateString(); 
        visible1 = false;
        await onSearch();
    }

    async Task EndDateClick(Func<Task> onSearch)
    {
        end = date2.ToShortDateString(); 
        visible2 = false;
        await onSearch();
    }

    void OnBack()
    {
        // navigate
    }

    Task OnSearch()
    {
        return Task.Delay(1000);
    }

    void OnClear()
    {
        orderId = null;
        user = null;
        start = null;
        end = null;
    }

}